<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    *{
      margin: 0;
      padding: 0;
      list-style: none;
    }
    li{
      width: 180px;
      display: inline-block;
      margin-right: 10px;
      margin-bottom: 10px;
    }
    img{
      width: 100%;
    }
  </style>
</head>
<body>
  <button>点击</button>
  <ul>
    <!-- <li>
      <img src="https://image5.suning.cn/uimg/b2c/newcatentries/0070081143-000000000144879464_2_800x800.jpg" alt="">
      <h5>南极人【10双装】夏季男士丝袜超薄中筒袜男袜子薄款透气纯色商务袜P3038</h5>
      <p>25.00</p>
    </li>
    <li>
      <img src="https://image5.suning.cn/uimg/b2c/newcatentries/0070081143-000000000144879464_2_800x800.jpg" alt="">
      <h5>南极人【10双装】夏季男士丝袜超薄中筒袜男袜子薄款透气纯色商务袜P3038</h5>
      <p>25.00</p>
    </li> -->
  </ul>
</body>
</html>
<script>
  var oUl = document.querySelector("ul");
  var oBtn = document.querySelector("button");
  var arr = [{"goods_id":1,"title":"南极人【10双装】夏季男士丝袜超薄中筒袜男袜子薄款透气纯色商务袜P3038","img_big_logo":"https://image5.suning.cn/uimg/b2c/newcatentries/0070081143-000000000144879464_2_800x800.jpg","price":"25.00","current_price":"17.50","goods_number":24,"is_sale":true,"sale_type":"70%","is_hot":false,"category":"其他"},{"goods_id":2,"title":"南极人 袜子男士 男女士船袜 精梳棉竹纤维棉袜 情侣袜 运动 休闲 商务男袜短袜吸湿排汗透气男袜女袜子P3015K31","img_big_logo":"https://image3.suning.cn/uimg/b2c/newcatentries/0070081143-000000000132291774_2_800x800.jpg","price":"29.00","current_price":"29.00","goods_number":71,"is_sale":false,"sale_type":"100%","is_hot":true,"category":"内衣配饰"},{"goods_id":3,"title":"南极人 【5双礼盒装】男士袜子中筒棉袜四季商务袜透气袜子男P3014","img_big_logo":"https://image4.suning.cn/uimg/b2c/newcatentries/0070081143-000000000131021736_2_800x800.jpg","price":"29.00","current_price":"17.40","goods_number":85,"is_sale":true,"sale_type":"60%","is_hot":true,"category":"内衣配饰"},{"goods_id":4,"title":"Palmer’s 帕玛氏 孕妇 4359-6 产前产后妊娠纹多效玫瑰精华油 150ml 美国直采","img_big_logo":"https://image3.suning.cn/uimg/b2c/newcatentries/0070088060-000000000618581890_1_800x800.jpg","price":"74.00","current_price":"74.00","goods_number":13,"is_sale":false,"sale_type":"100%","is_hot":true,"category":"其他"},{"goods_id":5,"title":"PPTV-32C3 32英寸 1GB+8GB 4核 64位处理器 高清智能网络WIFI平板电视机","img_big_logo":"https://image1.suning.cn/uimg/b2c/newcatentries/0000000000-000000000657032630_1_800x800.jpg","price":"679.45","current_price":"679.45","goods_number":82,"is_sale":false,"sale_type":"100%","is_hot":true,"category":"大家电"},{"goods_id":6,"title":"浪莎保暖裤 加绒加厚 外穿打底裤高腰踩脚裤 女秋冬大码中厚连裤袜","img_big_logo":"https://image3.suning.cn/uimg/b2c/newcatentries/0070129883-000000000160116107_2_800x800.jpg","price":"19.00","current_price":"13.30","goods_number":41,"is_sale":true,"sale_type":"70%","is_hot":false,"category":"内衣配饰"}]
  oBtn.onclick = function(){
    var str = ''
    for (var i = 0;i < arr.length;i++){
      str += `<li>
      <img src="${arr[i].img_big_logo}" alt="">
      <h5>${arr[i].title}</h5>
      <p>￥${arr[i].price}</p>
    </li>`
    }
    oUl.innerHTML = str
  }
</script>